<template>
  <view class="login-container">
    <view class="header">
      <image class="avatar" :src="tipPng"></image>
      <view class="title">飞手平台</view>
      <view class="subtitle">专业的无人机服务平台</view>
    </view>
    <view class="login-box">
      <button
        open-type="getPhoneNumber"
        @getphonenumber="getphonenumber"
        type="primary"
        class="login-btn"
        :disabled="checkbox1.length == 0"
      >
        手机号一键登录
      </button>
    </view>
    <view class="user_agreement">
      <uni-data-checkbox
        multiple
        v-model="checkbox1"
        :localdata="content"
        style="transform: scale(1.2)"
      ></uni-data-checkbox>
      <view class="agreement-text">
        我已阅读并同意<text class="agreement-link" @click="goagreement"
          >《用户协议》</text
        >
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref } from "vue";
import tipPng from "@/static/images/head.jpg";
import api from "@/utils/api.js";
import { setUserInfo } from "@/utils/index.js";
import { onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app";
let checkbox1 = ref([]);
const content = [
  {
    text: "",
    value: 1,
  },
];
const goagreement = () => {
  uni.navigateTo({
    url: "/pages/agreement/agreement",
  });
};
 
const getphonenumber = async (e) => {
  if (e.detail.errMsg == "getPhoneNumber:ok") {
    const data = {
      encryptedData: e.detail.encryptedData,
      iv: e.detail.iv,
    };

	uni.showLoading({
		title: '登录中...'
	})

	const result = await api.bindMobile(data);
	uni.hideLoading();
	setUserInfo(result.data);

	uni.navigateTo(-1)

    // wx.login({
    //   success: async (res) => {
    //     if (res.errMsg === "login:ok") {
    //       const answer = await api.login({ weixinCode: res.code });
    //       if (answer.data) {
    //         uni.setStorageSync("token", answer.data.token); // 缓存token
    //         const result = await api.bindMobile(data);
    //         if (result.data || result.code === -1) {
    //           uni.showToast({
    //             title: "登录成功",
    //             icon: "success",
    //             duration: 1500,
    //           });
    //           setTimeout(() => {
    //             if (uni.getStorageSync("sharecode")) {
    //               uni.redirectTo({
    //                 url:
    //                   "/pages/courseDetail/courseDetail?sharecode=" +
    //                   uni.getStorageSync("sharecode") +
    //                   "&courseId=" +
    //                   uni.getStorageSync("jlSharecourseId"),
    //               });
    //             } else {
    //               uni.switchTab({
    //                 url: "/pages/index/index",
    //               });
    //             }
    //           }, 1500);
    //         }
    //       }
    //     }
    //   },
    // });
  }
};

// 分享给朋友
onShareAppMessage(() => {
  return {
    title: '分享一个页面',
    path: '/pages/login/login'
  };
});

// 分享到朋友圈
onShareTimeline(() => {
  return {
    title: '分享一个页面',
    query: '' // 如果有参数可以带上
  };
});
</script>
<style lang="scss" scoped>
:deep(
    .uni-data-checklist
      .checklist-group
      .checklist-box.is--default.is-checked
      .checkbox__inner
  ) {
  border-color: #2cbaff;
  background-color: #2cbaff;
}
:deep(.uni-data-checklist .checklist-group .checklist-box) {
	margin-right: 0;
}
.login-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100vh;
  background-color: #f8f8f8;
  padding: 0 40rpx;
}
.header {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 120rpx;
  margin-bottom: 80rpx;
}
.avatar {
  width: 160rpx;
  height: 160rpx;
  border-radius: 80rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.1);
}
.title {
  font-size: 48rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 20rpx;
}
.subtitle {
  font-size: 28rpx;
  color: #666;
}
.login-box {
  width: 100%;
  margin-top: 60rpx;
}
.login-btn {
   width: 100%;
   height: 90rpx;
   line-height: 90rpx;
   font-size: 32rpx;
   border-radius: 45rpx;
   background: #2cbaff;
   box-shadow: 0 8rpx 16rpx rgba(44, 186, 255, 0.3);
 }
 wx-button[disabled][type=primary]  {
	background-color: rgba(#2cbaff, 0.5)!important;
 }
.user_agreement {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 40rpx;
  padding: 20rpx 0;
}
.agreement-text {
  font-size: 26rpx;
  color: #666;
  margin-left: 10rpx;
}
.agreement-link {
   color: #2cbaff;
 }
</style>
